<template>
    <div style="height: 100%">
        <el-button @click="addLogistic">添加物流信息</el-button>
        <el-steps direction="vertical" :active="1" space="200px">
            <el-step v-for="item in logisticsList" :title="item" icon="el-icon-remove"></el-step>
        </el-steps>
        <el-dialog title="添加物流信息"  :visible.sync="show">
            <el-form>
                <el-form-item label="物流单号">
                    <el-input v-model="info.orderLogisticsNumber" :disabled="disable"></el-input>
                </el-form-item>
                <el-form-item label="添加物流状态:">
                    <el-input v-model="logistic"></el-input>
                </el-form-item>
                <el-form-item label="是否完成收货">
                    <el-radio-group v-model="radio">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="2">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-button @click="sendlogistic">确定</el-button>
                <el-button @click="cancelSend">取消</el-button>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
    import {Store as $store} from "vuex";
    export default {
        name: "LogisticsInformation",
        data(){
            return{
                show:false,
                info:{
                    orderNo:'',
                    orderStatus:'',
                    orderLogisticsInfor:'',
                    orderLogisticsNumber:'',
                },
                disable:false,
                logistic:'',
                logisticsList:[],
                radio:'1'
            }
        },
        methods:{
            getInfor(){
                this.$http({method:'get',url:'/logistics/getLogistics',params:{orderNo:this.info.orderNo}}).then(res=>{
                        this.logisticsList=res.data.orderLogisticsInfor.split(",");
                        this.info.orderLogisticsNumber=res.data.orderLogisticsNumber;

                        if(this.info.orderLogisticsNumber!=null ||this.info.orderLogisticsNumber!=''){
                            this.disable=true
                        }
                })
            },
            addLogistic(){
                this.show=true;
            },
            cancelSend(){
                this.show=false;
            },
            sendlogistic(){
                if(this.logistic!=''){
                    this.logisticsList.unshift(this.logistic);
                    this.info.orderLogisticsInfor=this.logisticsList.toString();
                    this.updateInfo();
                    if(this.radio==1){
                        this.info.orderStatus=6;
                        this.$http({method:'post',url:'/order/setOrderStatus',data:this.info}).then(res=>{
                            if(res.data.state==200){
                                this.$message('状态更新成功');
                            }else {
                                this.$message.error('状态更新失败');
                            }
                        })
                    }
                    this.show=false;
                }

            },
            updateInfo(){
                this.$http({method:'post',url:'/logistics/updateLogistics',data:this.info}).then(res=>{
                    if(res.data.state=="200"){
                        this.$message('物流更新成功');
                    }else {
                        this.$message.error('物流更新失败');
                    }
                    this.logistic='';
                })
            }
        },
        created(){
            this.info.orderNo=this.$store.state.orderNo;
            console.log(this.info)
            this.getInfor();
        }
    }
</script>

<style scoped>

</style>